// import Vue from 'vue'

// 问题:
// 1. 所有的指令都是全局自定义指令, 不灵活 => 想全局就全局, 想局部就是局部
// 2. 相当于所有的指令都被注册了, 不一定都要使用(浪费) => 按需使用, 想用那个指令就自己导入使用

// 封装一个全局自定义指令, v-imgerror
// <img src="">
// 指令的核心逻辑就是指令的配置对象
export const imgerror = {
  // 指令的钩子函数
  inserted(el, binding) {
    // el  指令所在的dom
    // binding 指令信息对象, binding.value 指令的值
    // 需要看见打印的结果是什么, 挂载自定义指令
    // console.log(el, binding.value)
    // el.src = binding.value  不是无脑替换src
    el.onerror = function() {
      el.src = binding.value
    }
  }
}
// Vue.directive('imgerror', {
//   // 指令的钩子函数
//   inserted(el, binding) {
//     // el  指令所在的dom
//     // binding 指令信息对象, binding.value 指令的值
//     // 需要看见打印的结果是什么, 挂载自定义指令
//     console.log(el, binding)
//     // el.src = binding.value  不是无脑替换src
//     el.onerror = function() {
//       el.src = binding.value
//     }
//   }
// })
